<template>
  <div v-loading="listLoading" class="priceStrategyInfo">
    <div class="cont">
      <el-row :gutter="20">
        <el-col :span="18">
          <label class="title">{{ priceStrategy.strategyName }}</label>
          <p class="remark">{{ priceStrategy.remark }}</p>
        </el-col>
        <el-col :span="6" style="text-align: right">
          <el-button
            v-if="priceStrategy.approved == 0"
            v-permissions="['admin']"
            type="warning"
            icon="el-icon-finished"
            @click="handleApproval()"
          >
            审批通过
          </el-button>
          <el-tag
            v-else-if="priceStrategy.approved == 1"
            type="success"
            disable-transitions
          >
            已审批
          </el-tag>
        </el-col>
      </el-row>
    </div>
  </div>
</template>
<script>
import { doApproved } from '@/api/priceStrategyManagement'
export default {
  name: 'PriceStrategyInfo',
  data() {
    return {
      listLoading: false,
      priceStrategy: {},
    }
  },
  created() {},
  methods: {
    showPriceStrategyInfo(data) {
      this.listLoading = true
      this.priceStrategy = data
      setTimeout(() => {
        this.listLoading = false
      }, 300)
    },
    handleApproval() {
      this.$baseConfirm('你确定要通过当前价格策略的审核吗？', null, async () => {
        await doApproved(this.priceStrategy.id)
        this.$baseMessage('审核成功。', 'success')
        this.priceStrategy.approved = 1
        //location.reload()
      })
    },
  },
}
</script>
<style lang="scss" scoped>
.priceStrategyInfo {
  border: 1px solid $base-border-color;
  box-sizing: border-box;
  padding: 10px;
  margin-bottom: 10px;
  .cont {
    font-size: 12px;
    .title {
      font-size: 17px;
      line-height: 36px;
      font-weight: bold;
      color: forestgreen;
    }

    .el-tag {
      margin-top: 5px;
    }
  }
}
</style>
